<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>

  <style>
    * {
      margin: 0;
      padding: 0;
    }

    li {
      list-style: none;
    }

    .app {
      width: 100%;
      height: 50px;
      /* background-color: pink; */
    }

    .box{
      position: relative;
      width: 300px;
      height: 50px;
      margin: 0 auto;
    }
    .top {
      display: flex;
      width: 100%;
      height: 100%;
      justify-content: space-around;
      align-items: center;
      background-color: rgba(33, 33, 33, .3);

    }

    .select,
    .add {
      width: 20px;
      height: 20px;
    }
    .cont{
      color: #fff;
    }

    /* 下拉框 */
    .bot {
      display: none;
      position: absolute;
      width: 100%;
      height: auto;
      background-color: rgba(33, 33, 33, .3);
    }
    .show{
      display: block;
    }
    .list{
      text-align: center;
      padding: 10px;
    }
    .list li{
      margin-bottom: 10px;
      color: #fff;
      cursor: pointer;
    }
  </style>
  
</head>

<body>

  <div class="app">
    <div class="box">
      <div class="top">
        <img class="select" src="../../img/1.jpg" alt="">
        <p class="cont">企业动态</p>
        <img class="add" src="../../img/tianjia.png" alt="">
      </div>
      
      <div class="bot">
        <ul class="list">
          <li class="item">企业动态</li>
          <li class="item">新闻中心1</li>
          <li class="item">新闻中心2</li>
        </ul>
      </div>
    </div>
  </div>





  <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
  <script>
    $(function () {
      $('.add').on('click',function () {
        $('.bot').toggleClass('show')
      })

      $('.item').on('click',function (e) {
        console.log(e.target.innerHTML);
        let val=e.target.innerHTML
        $('.cont').html(val)
        $('.bot').toggleClass('show')
      })
    })
  </script>
</body>

</html>